<template>
  <div class="n-register">
    <van-nav-bar :title="header"/>
    <div class="dph-content">
      <div class="dph-content-user">
        <div class="content-user-photo">
          <img src="../../assets/svg/dph_face.svg">
        </div>
        <div class="content-user-name"><p>报名信息已提交成功，请等待审核结果</p></div>
      </div>
    </div>
    <div class="dph-content-btn">
      <button class="dph-content-button" type="button" @click="handleBack">返回</button>
    </div>
  </div>
</template>

<script>
  import {
    Icon,
    Row,
    Field,
    Col,
    Uploader,
    Loading,
    Cell,
    CellGroup,
    Popup,
    Button,
    NavBar,
    Toast,
    Actionsheet,
    DatetimePicker
  } from 'vant';

  export default {
    name: 'waitResult',
    components: {
      [Loading.name]: Loading,
      [Toast.name]: Toast,
      [Button.name]: Button,
      [Icon.name]: Icon,
      [Uploader.name]: Uploader,
      [Row.name]: Row,
      [Col.name]: Col,
      [Cell.name]: Cell,
      [DatetimePicker.name]: DatetimePicker,
      [Popup.name]: Popup,
      [Field.name]: Field,
      [Actionsheet.name]: Actionsheet,
      [CellGroup.name]: CellGroup,
      [NavBar.name]: NavBar,
      [Button.name]: Button
    },
    data() {
      return {
        header: '聚合支付'
      };
    },
    methods: {
      handleBack() {
        this.$router.push('reconciliation');
      }
    }
  };
</script>
<style lang="less" scoped>
  .n-register {
    height: 100vh;
    width: 100vw;
    background-color: #fff;
  }
  .dph-content-btn {
    height: 1.6rem;
    line-height: 1.6rem;
    text-align: center;
    background: #fff;
    .dph-content-button {
      display: inline-block;
      width: 2.5rem;
      height: .8rem;
      line-height: .8rem;
      text-align: center;
      color: #fff;
      font-size: 14px;
      border-radius: 3px;
      background: #2F66F3;
      border: none;
    }
  }

  .dph-content {
    height: 3rem;
    background: #fff;
    p {
      margin: 0;
    }
    .dph-content-user {
      text-align: center;
      .content-user-photo {
        display: inline-block;
        margin-top: .72rem;
        width: 1.2rem;
        height: 1.2rem;
        border-radius: 50%;
        overflow: hidden;
        img {
          display: inline-block;
          width: 100%;
          height: 100%;
          font-size: 0;
          -webkit-background-size: cover;
          background-size: cover;
          background-repeat: no-repeat;
        }
      }
      .content-user-name {
        padding-top: .46rem;
        font-size: 13px;
        color: #333333;
      }
    }
  }
</style>
